iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 2
2
Modern Web

試著學 Hexo系列 第 2

(2) 試著學 Hexo - 什麼是 Hexo

  • 分享至 

  • xImage
  •  

前言

在學習 Hexo 之前讓我們先了解一下 Hexo 是什麼以及它的來龍去脈。

Hexo 是什麼

Hexo 是一款靜態網頁產生工具也可以說是部落格架設工具,相對於動態網頁來講,動態網頁通常會需要搭配一個資料庫,舉例來講 WordPress 就是屬於後者,動態網頁。

而 Hexo 是基於 Node.js 所製作的網誌框架,因此在這邊列一些我個人覺得是 Hexo 的優點

  • 編譯速度非常快,幾百篇只需要幾秒就可以編譯完成
    • 目前我部落格大概 400 多篇僅需 6 秒就可以讀取完全部檔案且只需要 1.83 分就可以編譯完成,當然這部分與我的 Node.js 版本以及 Hexo 版本有差,而且因為我本身一直都有在寫筆記的習慣,因此外掛我也安裝了不少,所以速度加減會有影響(笑)。
  • 外掛套件非常多
    • 官方所列出的外掛套件數量粗估約有 349 個,而文章後面我也會介紹哪些外掛是必備的。
  • 超多主題
    • 這邊舉例 Hexo 官方所提供的數量就高達 313 個主題,當然後面也會介紹幾個框架,並親自安裝教學設定。
  • 支援 MarkDown 格式撰寫
    • 由於網誌文章可以採用 MarkDown 撰寫,所以對於喜歡使用 MarkDown 的人絕對不能錯過。
    • 假使你想撰寫純粹的 HTML 也是完全可以的,只是將檔名從 .md 改成 .html 而已。
  • 支援一鍵部署到 GitHub Pages 或是 Heroku 等支援靜態網頁的空間
    • Hexo 官方本身有提供一鍵部署的套件。
    • 基本上如果你是使用 GitHub 或是 GitLab 當作網誌空間,可以說是完全零成本架設的,頂多唯一的成本可能就是圖片或者是學習 Hexo 成本而已。
  • 中文資源夠多
    • 你只要 Google 「Hexo 架設」或「Hexo 教學」就可以找到一大推教學文章而且是中文資源唷~

當然可能會說:「那 Hugo 呢?」,確實 Hugo 的編譯速度更快,雖然我沒玩過 Hugo,但先前有看過一些編譯報告就大概知道編譯速度非常快,因此這完全無法否認,但這次的主題主要是介紹 Hexo 如果對於 Hugo 有興趣的話也可以試著玩一下,可是 Hexo 在第四版開始,編譯效能有非常顯著的上升。

Hexo 起源地

接下來稍微講講 Hexo 的起源地,起源地是來自這裡 「Hexo 颯爽登場!」,作者在文章中有說到起初他是使用 Octopress ,但是因為 Octopress 的編譯速度實在是真的很慢五十幾篇就要一分鐘多甚至更多,比起我目前四百多篇文章相比五十篇就要一分鐘來講,確實會讓人受不了,此外 Octopress 官方也已經沒有更新一段時間了,所以作者就自己造輪子,也就是今天的 Hexo,因此這邊結論就是感謝 Octopress 才有今天的 Hexo(誤)。

如果你有進去文章內,你可以在下方看到滿多人都會到原作者這一篇文章底下留言朝聖,雖然這一篇文章是在 2012 發布,但也是因為有作者的辛苦才有今日的 Hexo 可以使用(膜拜)。

而且你也會發現滿多人都會推薦使用 Hexo 當作部落格架設工具,最主要原因是學習成本較低且中文資源完善,但是其實架設過程還是很容易踩到一些地雷,以我自己來舉例的話,我在一開始架設學習 Hexo 就花了大概三天才弄好,過程就踩了不少雷,還邊架設邊跟朋友 幹樵 聊天呢。(最後還推坑幾個人一起來用 Hexo)

踩雷,圖源:網路

Hexo 目前版本

Hexo 目前版本號已經到達 4(我撰寫這一篇文章時已經剛好大跳躍版本到 Hexo 5),這之間如果你剛好想入坑架設自己的部落格又或者剛好你是 Hexo 較低的版本(Hexo 4 以下),那麼我個人會建議你可以考慮升級 Hexo 4 或從 Hexo 4 開始入坑,其主要原因在於 Hexo 4 與 Hexo 3 的編譯速度是真的相差滿多的,此外影響效能的另一個主因是 Node.js,因此若是使用 Hexo 4 並搭配適合的 Node 版本,那麼在編譯上是可以非常快速的,而這邊詳細的細節可以從官方的文章看到測試說明唷

Speed is the Key - How We Make Hexo 30% Faster

當然編譯的速度還是會受到一些因素而受影響,例如電腦、插件安裝的多寡等,但以我自己測試下來 Hexo 4 確實比 Hexo 3 的編譯還快很多(印象原本編譯一分鐘變成只剩下 15 秒)。

那麼今天鐵人賽就先到這裡告一個段落,認識了 Hexo 基本的歷史淵源之後,接下來就準備來安裝 Hexo 囉。


上一篇
(1) 試著學 Hexo - 序章
下一篇
(3) 試著學 Hexo - 如何安裝 Hexo
系列文
試著學 Hexo33
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言